<template>
  <div style="margin-left: 150px;font-size: 30px;margin-top: 10px">
    <a href="#" style="color:#545454;text-decoration: none;">LO<span style="color: #c4c4c4">V</span><span>O</span> |
      朗沃商城</a>
  </div>
  <div class="cjh" style="display:flex;margin-top: 20px">
    <div style="width: 1000px;height: 800px;text-align:center">
      <p style="font-size: 38px;color: white;padding-top: 270px">多快好省，只为品质生活</p>
      <p style="font-size: 22px;color:#d3d3d3;">优质产品，超低价格，太好逛了吧</p>
      <p style="font-size: 22px;color:#d3d3d3;">好生活，购实惠</p>
    </div>
    <div style="display: flex;align-items: center;justify-content: center;margin: 0 auto">
      <div
          style="background-color: white;width: 400px;height: 500px;display: flex;align-items: center;justify-content: center;flex-wrap: wrap">
        <div style="padding-top: 50px">
          <el-input size="large" style="width: 350px;height: 50px;font-size: 18px" placeholder="用户名"
                    v-model="userName">
            <template #prefix>
              <el-icon>
                <UserFilled/>
              </el-icon>
            </template>
          </el-input>
        </div>
        <div>
          <el-input size="large" type="password" style="width: 350px;height: 50px;font-size: 18px" placeholder="密码"
                    v-model="userPassword">
            <template #prefix>
              <el-icon>
                <Lock/>
              </el-icon>
            </template>
          </el-input>
        </div>
        <div>
          <el-button size="large" style="margin: 0 25px" type="primary" @click="userLogin()" round>登录</el-button>
          <el-button size="large" style="margin: 0 25px" @click="$router.push('qLogon')" round>快速注册</el-button>
        </div>
        <div>
          <p style="color:#e0e0e0;" @click="adminLogin()">管理员登录</p>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import {ElMessage} from "element-plus";
import axios from "axios";


export default {
  name: "Login",
  data() {
    return {
      adminEntity: {
        "adminName": "",
        "adminPassword": ""
      },
      userName: "1eua",
      userPassword: "123456",
      obj: {}
    };
  },
  methods: {
    //管理员登录
    adminLogin() {
      this.adminEntity.adminName = this.userName;
      this.adminEntity.adminPassword = this.userPassword;
      axios.post('/api/admins', this.adminEntity).then(resp => {
        if (resp.data.code == 1) {
          console.log(resp.data.data);
          this.$router.push("admin");
        } else {
          this.$message.error(resp.data.msg)
        }
      })
    },
    //用户登录
    userLogin() {
      axios.get('/api/users/' + this.userName + '/' + this.userPassword).then(resp => {
        //登陆成功
        if (resp.data.code === 1) {
          console.log(resp.data.data);
          sessionStorage.setItem("userToken", resp.data.data)
          this.$notify({
            title: "登陆成功!",
            message: '恭喜您登陆成功!!!',
            type: 'success'
          });
          this.$router.push("app");
          //登录失败
        } else {
          this.$notify({
            title: '登录失败!',
            message: resp.data.msg,
            type: 'error'
          });
        }
      })
    },
  }
}
</script>

<style>
.cjh {
  width: 1600px;
  margin: auto;
  background-image: url("../img/mount.png");
  background-repeat: repeat-y;
  background-position: center;
  background-attachment: fixed;
  background-size: 1600px auto;
}
</style>